<template>
  <div class="bgcard">
    <div class="card_content">
      <div class="card" v-for="(item, index) in cardList" :key="index">
        <div v-if="(item.cardType == 'D' || item.cardType == 'E' ) && item.secondaryCalliper == '0'" class="home_t" @click="to_home(item.id)">家庭成员列表 ></div>
        <div class="card_detail" :style="[{backgroundImage:'url(' + item.cover + ')' }]" @click="to_interest(item.cardNum,item.cardType,item.maturityTime)">
		  <div :class="item.cardType == 'C' ?'card_number' : 'card_numberA'">{{item.cardNum}}</div>
		</div>
      </div>
    </div>
  </div>
</template>

<script>
import {
		baseUrl
	} from "@/config/tendIdConfig.js";
export default {
    name: "myInterest",
    data() {
        return {
            cardList:{},
        };
    },
    created() {
      this.getList();
    },
    methods: {
        getList() {
			const token = this.$store.getters?.customer_token || uni.getStorageSync("customer_token")
			const that = this;
			uni.request({
			   url: baseUrl + '/customer/equityInfoH5/web/web/equityCardQueryWithCardInfo',
			    method: "POST",
				header: {
					Authorization: token
				},
			    data: {
			    },
			    success(res) {
			        that.cardList = res.data.data
			    },
			});
        },
        //查看权益
        to_interest(cardNum,cardType,maturityTime){
			this.$u.route({
				url: "/pages_card/interest/index",
				params: {
					cardNum:cardNum,
					cardType:cardType,
					maturityTime:maturityTime,
				}
			})
        },
        to_home(id){
			this.$u.route({
				url: "/pages_card/home/index",
				params: {
					cardId:id
				}
			})
        }
    },
};
</script>

<style scoped>
* {
    padding: 0;
    margin: 0;
}
.card_content {
  display: inline-block;
  width: 100%;
  /* height: 100vh; */
  /* box-sizing: border-box; */
  vertical-align: middle;
  cursor: pointer;
  background-image: url(https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2023/11/20/1a65b8ce4201488f8567128ae503752c.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding:2.375rem 0rem ;
}
.bgcard{
  display: inline-block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  vertical-align: middle;
  cursor: pointer;
  background-image: url(https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2023/11/20/1a65b8ce4201488f8567128ae503752c.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.card{
  padding:0 1.25rem ;
}
.card_detail{
  display: inline-block;
  width: 100%;
  height: 13.75rem;
  vertical-align: middle;
  cursor: pointer;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.card_number{
  text-align: right;
  margin:11.25rem 2rem 0 0 ;
  font-size: 0.75rem;
  color: #FFFFFF;
}
.card_numberA{
  margin:11.25rem 0 0 2rem ;
  font-size: 0.75rem;
  color: #0a0a0af9;
}

.home_t{
  color: #fff;text-align: end;
  margin: 0.75rem 1rem -0.25rem 0;
}

</style>
